<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://unpkg.com/vue"></script>
</head>
<body>
<div id="app">
    <ul>
        <li v-for="el in products">
           {{el.name}}--￥{{el.price}}--{{el.category}}
        </li>
    </ul>
</div>
<script>
    var V=new Vue({
        el:'#app',
        data:{
            products:[
                {name: 'microphone', price: 25, category: 'electronics'},
                {name: 'laptop case', price: 15, category: 'accessories'},
                {name: 'screen cleaner', price: 17, category: 'accessories'},
                {name: 'laptop charger', price: 70, category: 'electronics'},
                {name: 'mouse', price: 40, category: 'electronics'},
                {name: 'earphones', price: 20, category: 'electronics'},
                {name: 'monitor', price: 120, category: 'electronics'}
            ]
        }
    })
</script>
</body>
</html>